@import "./sassConfig.scss";
@import "./normalize.scss";
@import "./ui.scss";
@import "./icon.scss";

/* color */
.color-main { color: $color-main; }

/* text-algin */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

/* float */
.pull-right { float: right; }
.pull-left { float: left; }

/* font-size */
.fs-24 { font-size: 24px; }

/* position */
.p-r { position: relative; }
.p-a { position: absolute; }

/* clearfix */
.clearfix { @extend %clearfix; }


/* common ui */
.select-car-btn {
    display: block;
    width: 240px;
    height: 84px;
    margin: 0 17px;
    border-radius: 100px;
    line-height: 84px;
    text-align: center;
    color: #fff;
    font-size: 26px;
    font-weight: 300;
    background-color: $color-main;
}

.user-container { padding: 0 30px; }

/* user router-link */
.group-links {
    a {
        position: relative;
        display: block;
        margin: 0 -30px;
        padding: 0 30px;
        height: 64px;
        line-height: 64px;
        color: rgba(255, 255, 255, .4);
        border-bottom: 1px solid rgba(255, 255, 255, .03);
        font-size: 15px;
    }
    .icon {
        width: 30px;
        height: 30px;
        margin: 0 16px -10px 0;
    }
    .arrow:after {
        content: "";
        position: absolute;
        right: 30px;
        top: 50%;
        width: 10px;
        height: 10px;
        margin-top: -7px;
        border-top: 1px solid #fff;
        border-right: 1px solid #fff;
        @include webkit(box-sizing, border-box);
        @include webkit(transform, rotate(45deg));
        opacity: .1;
    }
}